Understanding font-weight in CSS
font-weight is a CSS property that controls the thickness of text, ranging from 100 (thin) to 900 (extra-bold). Unlike the HTML <b> tag, it focuses purely on visual styling without affecting semantic meaning.
font-weight: normal;– Standard weight (usually 400).font-weight: bold;– Bold weight (usually 700).font-weight: 100-900;– Fine-grained control over text thickness.CSS allows you to make text visually bold without changing HTML semantics.
Use
font-weightin combination with semantic tags like<strong>for accessibility and meaning.
This example shows how CSS font-weight can control the thickness of different text elements independently of HTML tags. It provides flexibility in design while keeping HTML semantic.
font-weightcontrols visual boldness without adding semantic meaning.CSS provides precise control using numeric values (100–900) or keywords (
normal,bold).Combine
font-weightwith semantic HTML for both design and accessibility.Avoid using
<b>solely for styling; use CSS instead.